<!DOCTYPE html>
<html lang="en" style="height:100%">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>买入已取消</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css" />
    <link rel="stylesheet" type="text/css" href="../../css/vant.css" />
    <!-- <link rel="stylesheet" href="../../css/sqc.css"> -->
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        input{
            outline:none;
        }

    </style>
</head>

<body style="background: #fff;">
<div id="blank" class="header" v-cloak>
    <div v-back.tapmode class="back"></div>
    <span class="title">{{api.pageParam.status == 1 ? '买入已超时' : '卖出已超时'}}</span>
</div>
<div id="app" style="padding-top: 55px;"  v-cloak>
    <div class="purchase-order obligation">
        <div class="sell-content-top">
            <div class="details">
                <div>
                  <img class="sell-top-img" v-src="'../../image/arrow.png'"/>
                  <span style="vertical-align: middle;display: inline-block;">预计获得{{overtime_con.orderType == 1 ? 'QHR' : 'CNY'}}</span>
                </div>
                <div>
                  <img class="sell-top-img" v-src="'../../image/arrow-2.png'"/>
                  <span style="vertical-align: middle;display: inline-block;">预计支出{{overtime_con.orderType == 1 ? 'CNY' : 'QHR'}}</span>
                </div>
            </div>
            <div class="details-bottom">
                <div>{{overtime_con.orderType == 1 ? overtime_con.tradeNum : overtime_con.totalPrice}}</div>
                <div>{{overtime_con.orderType == 1 ? overtime_con.totalPrice :  overtime_con.tradeNum}}</div>
            </div>
        </div>
        <div class="pay-tips" v-show="overtime_con.orderType == 1">

            由于您未在订单支付时间内完成交易，已自动取消，
            您已被系统精 确标记，如果<span style="color: #F95656;font-weight: bold;">标记2次</span>，系统将自动赠送特殊buff，
            <span style="color: #F95656;font-weight: bold;">24小时内禁止
            进行交易</span>。

        </div>

        <div class="pay-tips"  v-show="overtime_con.orderType == 2">
            由于买家未在订单支付时间内完成交易，已自动取消，您的QHR （含手续费）
            资产已自动退回，买家已被系统精确标记，如果<span style="color: #F95656;font-weight: bold;">标记 2次</span>，
            系统将自动赠送特殊buff，
            <span style="color: #F95656;font-weight: bold;">     24小时内禁止进行交易</span>。
        </div>
        <div class="pur-content voucher">
            <div class="tran-content">
                <div class="seller-number-title tips-pay" style="margin-bottom: 20px">
                    <div class="tips-pay-left">
                        <p class="seller-letter">
                            {{overtime_con.orderType == 1? hide_name_two(overtime_con.buyNickname) : hide_name_two(overtime_con.sellNickname)}}
                        </p>
                        <p class="seller-name">{{overtime_con.orderType == 1? hide_name(overtime_con.buyNickname) : hide_name(overtime_con.sellNickname)}}</p>
                    </div>

                </div>
                <div class="detail-title">
                    <div class="unit-price-color">单价</div>
                    <div>{{overtime_con.tradePrice}} CNY</div>
                </div>
                <div class="detail-title">
                    <div class="unit-price-color">锁定时间</div>
                    <div>{{overtime_con.createTime}}</div>
                </div>
                <div class="detail-title">
                    <div class="unit-price-color">取消时间</div>
                    <div>{{overtime_con.updateTime}}</div>
                </div>
                <div class="detail-title">
                    <div class="unit-price-color">订单号</div>
                    <div>{{overtime_con.orderNo}}</div>
                </div>
            </div>
            <!-- v-open-win="{orderNo:overtime_con.orderNo,sellstatus:overtime_con.orderType}" vurl="overtime" -->
            <div class="pro-complaint" v-open-win="{orderNo:overtime_con.orderNo,sellstatus:overtime_con.orderType}" vurl="overtime" v-show="overtime_con.orderType == 1">问题申诉</div>
            <div class="confirm-pay"  v-show="overtime_con.orderType == 2">我的资产</div>
        </div>
    </div>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/components.js"></script>
<script type="text/javascript" src="../../script/jquery.js"></script>
<script type="text/javascript" src="../../script/vant.min.js"></script>

<script>
    var vm,
        wx,

        overtime_list,
        overtime_con,
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank'
        })
        var details={
          agtVer:1,
          clientVer:1,
          ctime:201911071802959,
          cctime:201911071802959,
          sign:"abcdefg",
          token:getPrefs('token'),
          orderNo:api.pageParam.orderid,
          orderType:api.pageParam.status,
        }
        var base = new Base64();
        var	item=base.encode(JSON.stringify(details))
        var data = {
            jsonData:item,
        };
        var callback=function(ret){
          var base = new Base64();
          var overtime_list = base.decode(ret.content.jsonData);
            overtime_list =JSON.parse( overtime_list);
            // content_list=JSON.parse(data_list);
            overtime_con = overtime_list.coOrder;
            console.log(JSON.stringify(overtime_con));
            initApp();
        }
        pinet.post(APIURLP+'/play/od/getOverTimeInfoData',data, callback);
        api.parseTapmode();

    };

    function initApp() {
        // var isBigImg = Vue.BSImg == 'big';
        vm = new Vue({
            el: '#app',
            data: {
              overtime_list:overtime_list,
              overtime_con:overtime_con,
            },
            computed: {
            },
            methods: {
            
              hide_name_two:function(name){
                return new Array(name.length).join('') + name.substr(-1);
              },
              hide_name:function(name){
                return new Array(name.length).join('*') + name.substr(-1);
              },
            },
            watch: {

            },
        })
    }

</script>

</html>
